<template>
	<view>
		<view class="text">
			<img src="../../static/friend3.png" class="Friends2"></img>
			<img src="../../static/radio-on-full (1).png" class="addFriends1"></img>
			<view class="text1">
				<view class="name">
					大白兔
				</view>
				<view class="content">
					你已添加对方为好友，请开始聊天吧！
				</view>
			</view>
		</view>
		<view class="blank">
			<text class="friendtext"></text>
		</view>
		<view class="text_">
			<view class="text1">
				<view class="myName">
					我
				</view>
				<view class="content">
					hello，hello
				</view>
			</view>
			<image class="labixiaoxin" src="../../static/labixiaoxin.png" mode=""></image>
		</view>
		<view class="blank">
			<text class="friendtext"></text>
		</view>
		<view class="text">
			<img src="../../static/friend3.png" class="Friends2"></img>
			<img src="../../static/radio-on-full (1).png" class="addFriends1"></img>
			<view class="text1">
				<view class="name">
					大白兔
				</view>
				<view class="content">
					你好！
				</view>
			</view>
		</view>
		<view class="faSongKuang">
			<view class="inPut">
				<input type="text">
			</view>
			<view class="faSong">
				发送
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {

		}
	}
</script>

<style>
	.blank {
		background-color: white;
		height: 25px;
		margin-top: 5px;
	}
	.Friends2 {
		position: absolute;
		width: 45px;
		height: 45px;
		z-index: 2;
		padding-left: 6px;
		padding-bottom: 2px;
	}

	.addFriends1 {
		position: relative;
		z-index: 0;
		width: 15vw;
	}

	.text {
		margin-top: 5px;
		margin-left: 15px;
		display: flex;
		line-height: 28upx;

	}

	.text_ {
		display: flex;
		flex-direction: row;
		width: 100%;
		height: 80px;
		justify-content: flex-end;
	}

	.myName {
		display: flex;
		justify-content: flex-end;
	}

	.paidaxing {
		height: 60px;
		width: 60px;
	}

	.labixiaoxin {
		height: 60px;
		width: 60px;
	}

	.text1 {
		flex-direction: column;
		display: flex;
		position: relative;
		justify-content: space-between;
	}

	.faSongKuang {
		position: absolute;
		bottom: 0%;
		width: 100%;
		height: 30px;
		display: flex;
		justify-content: space-between;
	}

	.inPut {
		background-color: #cccccc;
		width: 90%;
	}
</style>
